/* ====================================== toast  ====================================== */
import React from 'react'
import { Radio } from 'antd'
// ===================================================================== Radio
const _ = ({ data= [], idStr= 'value', nameStr= 'name', name, value, onChange, onChanged, onClick, size, disabled, outer, className }) => {
	const [ result, setResult ] = React.useState(value)
	
	React.useEffect(()=>{
		setResult(value)
	},[value])
	
	const _onChange = React.useCallback( e => {
		const value = e.target.value
		const model = name ? { [name]: value } : value
		
		if(!outer){ setResult(value) }
		
		onChanged?.({ model, value })
		onChange?.(value)
	},[onChange, onChanged, name, outer])
	
	return (
		<Radio.Group className={'ex ' + className} style={{display: 'flex'}} size={size} value={result} onChange={_onChange} buttonStyle='solid' disabled={disabled}>
			{
				data.map((v, i) => (
					<div className='ex' key={i}>
						<Radio onClick={()=>{onClick&&onClick(i)}} value={v[idStr]} style={{ marginRight: 0 }}>{v[nameStr] ? v[nameStr] : undefined}</Radio>
					</div>
				))
			}
		</Radio.Group>
	)
}
export default _